<template>
<h3>组件生命周期</h3>
<p>{{ message }}</p>
<button @click="message = '数据'">点击</button>
</template>

<script>
export default{
    name:"Mycomponent",
    data(){
        return{
            message:""
        }
    },
    beforeCreate(){
        console.log("创建组件之前");
        
    },
    created(){
        console.log("创建组件之后");
        
    },
    beforeMount(){
        console.log("组件渲染之前");
        
    },
    mounted(){
        console.log("组件渲染之后");
        //网络请求放在这里
    },
    beforeUpdate(){
        console.log("组件更新之前");
        
    },
    updated(){
        console.log("组件更新之后");
        
    },
    beforeUnmount(){
        console.log("组件卸载之前");
        //卸载之前，把消耗性能的处理都干掉
        //定时器
    },
    unmounted(){
        console.log("组件卸载之后");
        
    }
}
</script>